<!DOCTYPE html>
<html lang="en">
   	<head>
		<meta charset="UTF-8">
		<title>报备列表</title>
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<meta name="keywords" content="这里写关键字">
		<meta name="description" content="这里写页面描述">
		<meta name ="viewport" content ="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> 
		<meta name="format-detection" content="telephone=no,email=no" />
		<link href="fontAwesome/css/font-awesome.min.css" rel="stylesheet">
		<link href="css/common.css" rel="stylesheet">
		<link href="css/main.css" rel="stylesheet">
		<script type="text/javascript" src="js/jquery.min.js"></script>
	</head>
</head>
<body>
	<div class="container">
		<div class="fixed-header clearfix">
			<div class="header-half bor-r">
				<select>
					<option>全部</option>
					<option>1</option>
					<option>2</option>
				</select>
				<i class="fa fa-angle-down"></i>
			</div>
			<div class="header-half">
				<a href="javascript:;">
					<img src="images/addIcon.png">
				</a>
				<a href="javascript:;" class="searchIcon">
					<img src="images/search.png">
				</a>
			</div>
		</div>
		<ul class="report-list-view">
			<li>
				<div class="report-info-cell">
					<div class="template-list-right">
						<div class="title">小名</div>
						<div class="content">2016-04-17</div>
					</div>
					<div class="report-list-details">
						<div class="report-phone">13817749864</div>
						<div class="report-name">东方雅苑</div>
						<div class="report-state colA">报备待确认</div>
					</div>
				</div>
			</li>
			<li>
				<div class="report-info-cell">
					<div class="template-list-right">
						<div class="title">小名</div>
						<div class="content">2016-04-17</div>
					</div>
					<div class="report-list-details">
						<div class="report-phone">13817749864</div>
						<div class="report-name">东方雅苑</div>
						<div class="report-state colB">报备有效</div>
					</div>
				</div>
			</li>
			<li>
				<div class="report-info-cell">
					<div class="template-list-right">
						<div class="title">小名</div>
						<div class="content">2016-04-17</div>
					</div>
					<div class="report-list-details">
						<div class="report-phone">13817749864</div>
						<div class="report-name">东方雅苑</div>
						<div class="report-state colB">已到访</div>
					</div>
				</div>
			</li>
			<li>
				<div class="report-info-cell">
					<div class="template-list-right">
						<div class="title">小名</div>
						<div class="content">2016-04-17</div>
					</div>
					<div class="report-list-details">
						<div class="report-phone">13817749864</div>
						<div class="report-name">东方雅苑</div>
						<div class="report-state colC">已过带看保护期</div>
					</div>
				</div>
			</li>
		</ul> 
		<div class="fixed-footer">
			<a href="javascript:;" class="footer-list">
				<span class="footer-icon"></span>首页
			</a>
			<a href="javascript:;" class="footer-list active">
				<span class="footer-icon footer-sec"></span>客户
			</a>
			<a href="javascript:;" class="footer-list">
				<span class="footer-icon footer-thrd"></span>动态
			</a>
			<a href="javascript:;" class="footer-list">
				<span class="footer-icon footer-four"></span>我的
			</a>
		</div>
		<!-- 弹出搜索层 -->
		<div class="search-mask">
			<div class="search-warp">
				<form action="" class="search-form">
					<input type="search" placeholder="请输入搜索内容"/>
				</form>
				<a href="javascript:;" class="cancelBtn">取消</a>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	$(function(){
		$(".searchIcon").click(function(){
			$(".search-mask").show();
		})
		$(".cancelBtn").click(function(){
			$(".search-mask").hide();
		})
	})
</script>
</html>
